{% extends "BackendBundle::backend.html.twig" %}

{% set vars = {'ruta' : app.request.attributes.get('_route')} %}

{% block title "Secciones" %}

{% block css %}

   {% stylesheets
        '@ContentBundle/Resources/public/css/default.css'
   %}
        <link rel="stylesheet" type="text/css" media="screen" href="{{ asset_url }}" />
   {% endstylesheets %}
        
{% endblock %}

{% block js %}

    {% javascripts
        '@ContentBundle/Resources/public/js/jquery-ui-1.js'
    %}
        <script src="{{ asset_url }}"></script>
    {% endjavascripts %}
        
        <script type="text/javascript">
            
            var sitemapHistory = {
                stack: new Array(),
                temp: null,
                //takes an element and saves it's position in the sitemap.
                //note: doesn't commit the save until commit() is called!
                //this is because we might decide to cancel the move
                saveState: function(item) {
                    sitemapHistory.temp = { item: $(item), itemParent: $(item).parent(), itemAfter: $(item).prev() };
                },
                commit: function() {
                    if (sitemapHistory.temp != null) sitemapHistory.stack.push(sitemapHistory.temp);
                },
                //restores the state of the last moved item.
                restoreState: function() {
                    var h = sitemapHistory.stack.pop();
                    if (h == null) return;
                    if (h.itemAfter.length > 0) {
                        h.itemAfter.after(h.item);
                    }
                    else {
                        h.itemParent.prepend(h.item);
                    }
                            //checks the classes on the lists
                            $('#sitemap li.sm2_liOpen').not(':has(li)').removeClass('sm2_liOpen');
                            $('#sitemap li:has(ul li):not(.sm2_liClosed)').addClass('sm2_liOpen');
                }
            }
          
            //init functions
            $(function() {
                $('#sitemap li').prepend('<div class="dropzone"></div>');

                $('#sitemap dl, #sitemap .dropzone').droppable({
                    accept: '#sitemap li',
                    tolerance: 'pointer',
                    drop: function(e, ui) {
                        var li = $(this).parent();
                        var child = !$(this).hasClass('dropzone');
                        if (child && li.children('ul').length == 0) {
                            li.append('<ul/>');
                        }
                        if (child) {
                            li.addClass('sm2_liOpen').removeClass('sm2_liClosed').children('ul').append(ui.draggable);
                        }
                        else {
                            li.before(ui.draggable);
                        }
                                    $('#sitemap li.sm2_liOpen').not(':has(li:not(.ui-draggable-dragging))').removeClass('sm2_liOpen');
                        li.find('dl,.dropzone').css({ backgroundColor: '', borderColor: '' });
                        sitemapHistory.commit();
                    },
                    over: function() {
                        $(this).filter('dl').css({ backgroundColor: '#ccc' });
                        $(this).filter('.dropzone').css({ borderColor: '#aaa' });
                    },
                    out: function() {
                        $(this).filter('dl').css({ backgroundColor: '' });
                        $(this).filter('.dropzone').css({ borderColor: '' });
                    }
                });
                
                //var myArray = new Array();
                //var countstart = 0;
                
                $('#sitemap li').draggable({
                    handle: ' > dl',
                    opacity: .8,
                    addClasses: false,
                    helper: 'clone',
                    zIndex: 100,
                    start: function(e, ui) {
                        sitemapHistory.saveState(this);

                        //myArray[countstart] = this;

                        //countstart++;

                    }
                });
                $('.sitemap_undo').click(sitemapHistory.restoreState);
                $(document).bind('keypress', function(e) {
                    if (e.ctrlKey && (e.which == 122 || e.which == 26))
                        sitemapHistory.restoreState();
                });

                $('.sm2_expander').live('click', function() {
                    $(this).parent().parent().toggleClass('sm2_liOpen').toggleClass('sm2_liClosed');
                    return false;
                });

                //init functions
                $(function() {

                    $('.control').live('click', function() {
                        
                        var myArray = new Array();
                        var countstart = 0;

                        $('#sitemap li').each(function(index) {
                            
                            myArray[countstart] = this;
                            countstart++;

                        });

                        var k = 0;
                        
                        var IDmogudo = "";
                        var IDpare = "";
                        var IDsota = "";

                        var ResultatArray = new Array();
                        
                        for (vkey in myArray) {

                            IDmogudo = "";
                            IDpare = "";
                            IDsota = "";

                            $(myArray[vkey]).find('.hotelid').each(function(index) {

                                if (index == 0) {
                                    //alert("Id Moguda --> "+ $(this).text());
                                    IDmogudo = $(this).text();
                                }
                            });

                            $(myArray[vkey]).parent().parent().find('.hotelid').each(function(index) {
                                //alert(index + ': ' + $(this).text());
                                if (index == 0) {
                                    //alert("Id Pare --> "+ $(this).text());
                                    IDpare = $(this).text();
                                }
                            });

                            $(myArray[vkey]).prev().find('.hotelid').each(function(index) {
                                //alert(index + ': ' + $(this).text());
                                if (index == 0) {
                                    //alert("id per sota de --> "+ $(this).text());
                                    IDsota = $(this).text();
                                }
                            });
                             
                            ResultatArray[k] = new Array();
                            ResultatArray[k][0] = IDmogudo;
                            ResultatArray[k][1] = IDpare;
                            ResultatArray[k][2] = IDsota;

                            //alert(IDmogudo +" - "+ IDpare +" - "+ IDsota);

                            k = k + 1;

                        }

                        $.ajax({
                            url: "{{ path('ContentBundle_secciones_list_ajax') }}",
                            type: "POST",
                            data: { 
                                "ididioma" : "{{ idioma }}",
                                "dadesArray" : ResultatArray 
                            },
                            success: function(data) {

                                // Quan tot va be, 
                                document.location.reload(true);
                                
                            }
                        });

                    });

                });     

            });                    
            
        </script>
        
{% endblock %}

{% block header %}

    {% include "BackendBundle::topmenu.html.twig" with vars %}

{% endblock %}

{% block left %}

    {% include "ContentBundle:Hotel:menuleft.html.twig" with vars %}

{% endblock %}

{% block content %}

    <div class="span9">
    
        <h2>{{ "Secciones"|trans }}</h2>
        <fieldset>
            <legend>{{ "Secciones de"|trans }} "{{hotel.hotelname}}"</legend>
            
            {% if app.session.hasFlash('success') %}
                <div class="flash-notice alert alert-success">
                    <h4 class="alert-heading">{{ "Ok"|trans }}!</h4>                     
                    {{ app.session.flash('success') }}
                </div>
            {% endif %}

            {% if app.session.hasFlash('error') %}
                <div class="flash-notice alert alert-error">
                    <h4 class="alert-heading">{{ "Error"|trans }}!</h4>                        
                    {{ app.session.flash('error') }}
                </div>
            {% endif %}

            {% if app.session.hasFlash('info') %}
                <div class="flash-notice alert alert-info">
                    <h4 class="alert-heading">{{ "Info"|trans }}!</h4>
                    <p>{{ app.session.flash('info') }}</p>
                </div>
            {% endif %}
            
            {% if arbre != 0 %}
                <div class="flash-notice alert alert-info">
                    <h4 class="alert-heading">{{ "Info"|trans }}!</h4>
                    <p>Si modificas el order, los cambios no seran reales hasta que no hagas <b>Aplicar Orden</b></p>
                </div>
            {% endif %}
            
            <noscript>

                <div class="flash-notice alert alert-error">
                    <h4 class="alert-heading">Javascript is disabled</h4>
                    <p>T'informo senyor usuari, que si no tens activat el Javascript, <b>no podras ordenar</b>.</p>
                </div>
            
            </noscript>            
            
            {% if languages|length != 0 and arbre !=0 %}
            
            <div class="btn-toolbar">
                <div class="btn-group">

                    {% for language in languages %}

                        <a href="{{ path("ContentBundle_secciones_list_idioma", {'ididioma': language.id}) }}" class="btn{% if idioma == language.id %} btn-primary{% endif %}">{{ language.idioma }}</a>

                    {% endfor %}    

                </div>
            </div>
            
            {% endif %}
                
            <div class="page">
            
                {% if arbre == 0 %}

                    <div>{{ "No hay Secciones creadas"|trans }}</div>

                {% else %}
                    
                    <ul id="sitemapfix">
                        
                        <li style="display: none;"><span class="hotelid">0</span><li>
                        
                        {% for ar in arbre %}
                        
                            {% if ar.principal == 1 %}

                                <li>
                                    <dl class="sm2_s_published ui-droppable">

                                        {% if ar.notraduccio == 1 %}

                                            <dt><span class="hotelid">{{ar.id}}</span> {{ar.text}}</dt>
                                            <dd class="sm2_actions" style="display: block;">
                                                <span class="label label-important">No hay traducción</span>
                                            </dd>
                                            <dd class="sm2_status">
                                                <a href="{{ path("ContentBundle_secciones_tradu", {'ididioma': idioma, 'idseccion': ar.idtradu}) }}" class="btn btn-mini btn-warning" title="{{ "Crear Traducción"|trans }}"><i class="icon-globe icon-white">&nbsp;</i></a>
                                            </dd>

                                        {% else %}

                                            <dt><span class="hotelid">{{ar.id}}</span> <a class="sm2_title" href="{{ path("ContentBundle_secciones_edit", {'ididioma': idioma, 'idseccion': ar.id}) }}">{{ar.text}}</a></dt>
                                            <dd class="sm2_actions">
                                                <a href="{{ path("ContentBundle_secciones_edit", {'ididioma': idioma, 'idseccion': ar.id}) }}" class="btn btn-mini" title="{{ "Editar"|trans }}"><i class="icon-pencil">&nbsp;</i></a> 
                                            </dd>
                                            <dd class="sm2_status">

                                                <a href="{{ path("ContentBundle_visible_seccion", {'ididioma': idioma, 'idseccion': ar.idtradu}) }}" class="btn btn-mini{% if ar.visible == 1 %} btn-success{% else %} btn-danger{% endif %}" {% if ar.visible == 1 %}title="{{ "No Visible"|trans }}"{% else %}title="{{ "Visible"|trans }}"{% endif %}><i class="{% if ar.visible == 1 %}icon-eye-open {% else %}icon-eye-close {% endif %}icon-white">&nbsp;</i></a>

                                            </dd>

                                        {% endif %}

                                    </dl>                        
                                </li>

                            {% endif %}
                        
                        {% endfor %}
                        
                    </ul>
                    
                    <ul id="sitemap">
                        
                        {% set antePare = 0 %}
                        {% set antePos = 0 %}
                        {% set faltaUna = 0 %}
                        {% set i = 0 %}
                        
                        {% for ar in arbre %}

                            <!-- Ho he tret d'aqui -->

                            {% if ar.principal != 1 %}
                            
                            {% set resultat = antePos - ar.pos %}
                            
                            {% if antePos > ar.pos %}
                            
                                {% for b in 1..resultat %}
                                
                                        </ul>
                                        </li>
                                        
                                        {% set faltaUna = 1 %}

                                {% endfor %}
                                
                            {% endif %}

                            <!-- Fi Ho he tret d'aqui -->

                            {% if ar.pare == 1 %}
                            <li class="sm2_liOpen">
                            {% else %}
                            <li>
                            {% endif %} 
                                <dl class="sm2_s_published ui-droppable">
                                    <a href="#" class="sm2_expander">&nbsp;</a>
                                    {% if ar.notraduccio == 1 %}
                                    
                                        <dt><span class="hotelid">{{ar.id}}</span> {{ar.text}}</dt>
                                        <dd class="sm2_actions" style="display: block;">
                                            <span class="label label-important">No hay traducción</span>
                                        </dd>
                                        <dd class="sm2_status">
                                            <a href="{{ path("ContentBundle_secciones_tradu", {'ididioma': idioma, 'idseccion': ar.idtradu}) }}" class="btn btn-mini btn-warning" title="{{ "Crear Traducción"|trans }}"><i class="icon-globe icon-white">&nbsp;</i></a>
                                        </dd>
                                    
                                    {% else %}
                                    
                                        <dt><span class="hotelid">{{ar.id}}</span> <a class="sm2_title" href="{{ path("ContentBundle_secciones_edit", {'ididioma': idioma, 'idseccion': ar.id}) }}">{{ar.text}}</a></dt>
                                        <dd class="sm2_actions">
                                            <a href="{{ path("ContentBundle_secciones_edit", {'ididioma': idioma, 'idseccion': ar.id}) }}" class="btn btn-mini" title="{{ "Editar"|trans }}"><i class="icon-pencil">&nbsp;</i></a> 
                                            <a href="{{ path("ContentBundle_secciones_borrar", {'ididioma': idioma, 'idseccion': ar.id}) }}" class="btn btn-mini btn-danger" title="{{ "Borrar"|trans }}"><i class="icon-trash icon-white">&nbsp;</i></a>
                                        </dd>
                                        <dd class="sm2_status">
                                            
                                            <a href="{{ path("ContentBundle_visible_seccion", {'ididioma': idioma, 'idseccion': ar.idtradu}) }}" class="btn btn-mini{% if ar.visible == 1 %} btn-success{% else %} btn-danger{% endif %}" {% if ar.visible == 1 %}title="{{ "No Visible"|trans }}"{% else %}title="{{ "Visible"|trans }}"{% endif %}><i class="{% if ar.visible == 1 %}icon-eye-open {% else %}icon-eye-close {% endif %}icon-white">&nbsp;</i></a>
                                            &nbsp;&nbsp;
                                            <a href="{{ path("ContentBundle_publish_seccion", {'ididioma': idioma, 'idseccion': ar.idtradu}) }}" class="btn btn-mini{% if ar.published == 1 %} btn-success{% else %} btn-danger{% endif %}" {% if ar.published == 1 %}title="{{ "Despublicar"|trans }}"{% else %}title="{{ "Publicar"|trans }}"{% endif %}><i class="{% if ar.published == 1 %}icon-ok-circle {% else %}icon-ban-circle {% endif %}icon-white">&nbsp;</i></a>
                                            
                                        </dd>
                                        
                                    {% endif %}
                                </dl>

                            {% set resultat2 = ar.pos - antePos  %}

                            {% if resultat != 0 or ar.pare == 1 %} 
                                
                                {% if ar.pare == 1 %}
                                    <ul>
                                {% else %}
                                    </li>
                                {% endif %}

                            {% else %}
                                    
                                </li>
                                
                            {% endif %}

                            {% set antePare = ar.pare %} 
                            {% set antePos = ar.pos %} 
                            {% set i = i + 1 %}
                                
                            {% if arbre|length == i and resultat2 > 0 %}

                                {% for c in 1..ar.pos %}

                                        </ul>
                                        </li>

                                {% endfor %}
                                        
                            {% elseif arbre|length == i and ar.pos > 0  %}

                                {% for c in 1..ar.pos %}

                                        </ul>
                                        </li>
                                
                                {% endfor %}     
                                        
                            {% endif %}
                                        
                            {% endif %}

                        {% endfor %}
                    </ul>
                    
                                
                    <div class="form-actions" align="center">
                        
                        <a class="control btn btn-primary btn-large">Aplicar Orden</a>
                        
                    </div>

                {% endif %}
                
            </div>
            
        </fieldset>
    </div>
        
        <!--<div id="proves"></div>-->

{% endblock %}
